<script setup lang="ts">
const props: any = defineProps<{
    ujt: any;
}>();
const { $global }: any = props.ujt;
</script>

<template>
    <AsPageBusy v-if="$global.pagebusy" :ujt="ujt"></AsPageBusy>
    <button @pointerdown="$global.pagebusy = { v: '加载中' }">点击显示loading</button>
    <div class="as-busy-demo">
        <button @pointerdown="$global.pagebusy = { v: '加载中', zindex: 10 }">
            指定弹窗z-index
        </button>
        <button
            @pointerdown="$global.pagebusy = { v: '更改加载中的文本', zindex: 10 }"
        >
            更改文本
        </button>
        <button @pointerdown="$global.pagebusy = null">关闭</button>
    </div>
    <p>
        提示：这个状态，通过双击空白区域，可以强制关闭。如果强制不给关闭，则添加$global.pagebusy.keep:1
    </p>
</template>
<style scoped lang="scss">
.as-busy-demo {
    position: relative;
    z-index: 11;
}
button {
    margin: 5px;
    height: 38px;
    padding: 0 12px;
    background-color: var(--ch8);
    color: var(--ch0);
}
</style>
